<link id="bs-css" href="css/bootstrap-cerulean.min.css" rel="stylesheet">
<link href="css/charisma-app.css" rel="stylesheet">
<!-- left menu starts -->
<div class="col-sm-2 col-lg-2" style="padding: 0px;">
    <div class="sidebar-nav">
        <div class="nav-canvas">
            <div class="nav-sm nav nav-stacked">

            </div>
            <ul class="nav nav-pills nav-stacked main-menu">
                <li class="nav-header">Main</li>
                <li><a target="rightFrame" class="ajax-link" href="index.html"><i class="glyphicon glyphicon-home"></i><span> Dashboard</span></a>
                </li>
                <li><a target="rightFrame" target="rightFrame" class="ajax-link" href="ui.html"><i class="glyphicon glyphicon-eye-open"></i><span> UI Features</span></a>
                </li>
                <li><a target="rightFrame" class="ajax-link" href="form.html"><i
                            class="glyphicon glyphicon-edit"></i><span> Forms</span></a></li>
                <li><a target="rightFrame" class="ajax-link" href="chart.html"><i class="glyphicon glyphicon-list-alt"></i><span> Charts</span></a>
                </li>
                <li><a target="rightFrame" class="ajax-link" href="typography.html"><i class="glyphicon glyphicon-font"></i><span> Typography</span></a>
                </li>
                <li><a target="rightFrame" class="ajax-link" href="gallery.html"><i class="glyphicon glyphicon-picture"></i><span> Gallery</span></a>
                </li>
                <li class="nav-header hidden-md">Sample Section</li>
                <li><a target="rightFrame" class="ajax-link" href="table.html"><i
                            class="glyphicon glyphicon-align-justify"></i><span> Tables</span></a></li>
                <li class="accordion">
                    <a target="rightFrame" href="#"><i class="glyphicon glyphicon-plus"></i><span> Accordion Menu</span></a>
                    <ul class="nav nav-pills nav-stacked">
                        <li><a target="rightFrame" href="#">Child Menu 1</a></li>
                        <li><a target="rightFrame" href="#">Child Menu 2</a></li>
                    </ul>
                </li>
                <li><a target="rightFrame" class="ajax-link" href="calendar.html"><i class="glyphicon glyphicon-calendar"></i><span> Calendar</span></a>
                </li>
                <li><a target="rightFrame" class="ajax-link" href="grid.html"><i
                            class="glyphicon glyphicon-th"></i><span> Grid</span></a></li>
                <li><a target="rightFrame" href="tour.html"><i class="glyphicon glyphicon-globe"></i><span> Tour</span></a></li>
                <li><a target="rightFrame" class="ajax-link" href="icon.html"><i
                            class="glyphicon glyphicon-star"></i><span> Icons</span></a></li>
                <li><a target="rightFrame" href="error.html"><i class="glyphicon glyphicon-ban-circle"></i><span> Error Page</span></a>
                </li>
                <li><a target="rightFrame" href="login.html"><i class="glyphicon glyphicon-lock"></i><span> Login Page</span></a>
                </li>
            </ul>
            <label id="for-is-ajax" for="is-ajax"><input id="is-ajax" type="checkbox"> Ajax on menu</label>
        </div>
    </div>
</div>
<!--/span-->
<!-- left menu ends -->